<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/listings.css">
    <link rel="shortcut icon" href="image/listings_img/favicon.ico" type="image/x-icon">
    <title>列表编辑</title>
</head>

<body style="overflow-x: hidden">
    <div id="app">
        <div class="listings-head">
            <div class="head-l fz16 c999 pinl30">
                列出您的房产
            </div>
            <div class="head-r fz16 c999 pinl30">
                预览列表
            </div>
        </div>
        <div class="listings-body">
            <div class="body-l listings2">
                <div class="lists linh">清单</div>
                <a>
                    <div class="Unselected linh edit location">位置</div>
                </a>
                <a>
                    <div class="checked linh txtcen location">基本</div>
                </a>
                <a>
                    <div class="Unselected linh edit txtcen location">设施</div>
                </a>
                <a>
                    <div class="Unselected linh edit txtcen location">照片</div>
                </a>
                <a>
                    <div class="Unselected linh edit txtcen location">描述</div>
                </a>
                <a>
                    <div class="Unselected linh edit txtcen location">定价</div>
                </a>
            </div>
            <div class="body-r">
                <div class="r-margin2">
                    <div class="r-title">
                        <h3 class="fontw c444">帮助房客找到您的房源</h3>
                            <h5 class="fontw c777">在Senseluxury上搜索的人可以通过列出基础知识进行过滤，以找到符合他们需求的空间帮助</h5>
                    </div>
                    <div class="r-option">
                        <div class="option1">
                            <div class="option-title martop">
                                <h2 class="fontw c444">卧室</h2>
                            </div>
                            <div class="option-select">
                                <select class="sele2 c777 txtcen" id="op1">
                                    <option value="">选择卧室</option>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option>
                                    <option value="5">5</option>
                                    <option value="6">6</option>
                                    <option value="7">7</option>
                                    <option value="8">8</option>
                                    <option value="9">9</option>
                                    <option value="10">10</option>
                                    <option value="11">11</option>
                                    <option value="12">12</option>
                                    <option value="13">13</option>
                                    <option value="14">14</option>
                                    <option value="15">15</option>
                                    <option value="16">16</option>
                                    <option value="17">17</option>
                                    <option value="18">18</option>
                                    <option value="19">19</option>
                                    <option value="20">20</option>
                                </select>
                            </div>
                        </div>
                        <div class="option2">
                            <div class="option-title martop">
                                <h2 class="fontw c444">游泳池</h2>
                            </div>
                            <div class="option-select">
                                <select class="sele2 c777 txtcen" id="op2">
                                    <option value="0">0</option>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option>
                                    <option value="5">5</option>
                                    <option value="6">6</option>
                                    <option value="7">7</option>
                                    <option value="8">8</option>
                                    <option value="9">9</option>
                                    <option value="10">10</option>
                                </select>
                            </div>
                        </div>
                        <div class="option3">
                            <div class="option-title martop">
                                <h2 class="fontw c444">浴室</h2>
                            </div>
                            <div class="option-select">
                                <select class="sele2 c777 txtcen" id="op3">
                                    <option value="0">0</option>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option>
                                    <option value="5">5</option>
                                    <option value="6">6</option>
                                    <option value="7">7</option>
                                    <option value="8">8</option>
                                    <option value="9">9</option>
                                    <option value="10">10</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="r-option">
                        <div class="option1">
                            <div class="option-title martop">
                                <h2 class="fontw c444">额外成人</h2>
                            </div>
                            <div class="option-select">
                                <select class="sele2 c777 txtcen">
                                    <option value="">选择成人</option>
                                    <option value="">1</option>
                                    <option value="">2</option>
                                    <option value="">3</option>
                                    <option value="">4</option>
                                    <option value="">5</option>
                                    <option value="">6</option>
                                    <option value="">7</option>
                                    <option value="">8</option>
                                    <option value="">9</option>
                                    <option value="">10</option>
                                    <option value="">11</option>
                                    <option value="">12</option>
                                    <option value="">13</option>
                                    <option value="">14</option>
                                    <option value="">15</option>
                                    <option value="">16</option>
                                    <option value="">17</option>
                                    <option value="">18</option>
                                    <option value="">19</option>
                                    <option value="">20</option>
                                    <option value="">21</option>
                                    <option value="">22</option>
                                    <option value="">23</option>
                                    <option value="">24</option>
                                    <option value="">25</option>
                                    <option value="">26</option>
                                    <option value="">27</option>
                                    <option value="">28</option>
                                    <option value="">29</option>
                                    <option value="">30</option>
                                    <option value="">31</option>
                                    <option value="">32</option>
                                    <option value="">33</option>
                                    <option value="">34</option>
                                    <option value="">35</option>
                                    <option value="">36</option>
                                    <option value="">37</option>
                                    <option value="">38</option>
                                    <option value="">39</option>
                                    <option value="">40</option>
                                </select>
                            </div>
                        </div>
                        <div class="option2">
                            <div class="option-title martop">
                                <h2 class="fontw c444">额外的小孩</h2>
                            </div>
                            <div class="option-select">
                                <select class="sele2 c777 txtcen">
                                    <option value="">选择孩子</option>
                                    <option value="">1</option>
                                    <option value="">2</option>
                                    <option value="">3</option>
                                    <option value="">4</option>
                                    <option value="">5</option>
                                    <option value="">6</option>
                                    <option value="">7</option>
                                    <option value="">8</option>
                                    <option value="">9</option>
                                    <option value="">10</option>
                                    <option value="">11</option>
                                    <option value="">12</option>
                                    <option value="">13</option>
                                    <option value="">14</option>
                                    <option value="">15</option>
                                    <option value="">16</option>
                                    <option value="">17</option>
                                    <option value="">18</option>
                                    <option value="">19</option>
                                    <option value="">20</option>
                                    <option value="">21</option>
                                    <option value="">22</option>
                                    <option value="">23</option>
                                    <option value="">24</option>
                                    <option value="">25</option>
                                    <option value="">26</option>
                                    <option value="">27</option>
                                    <option value="">28</option>
                                    <option value="">29</option>
                                    <option value="">30</option>
                                    <option value="">31</option>
                                    <option value="">32</option>
                                    <option value="">33</option>
                                    <option value="">34</option>
                                    <option value="">35</option>
                                    <option value="">36</option>
                                    <option value="">37</option>
                                    <option value="">38</option>
                                    <option value="">39</option>
                                    <option value="">40</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="number1">
                        <div class="number-title martop">
                            <h2 class="fontw c444">物业面积</h2>
                        </div>
                        <div class="number-inp">
                            <input type="number" placeholder="0" value="0"><label>平方米</label>
                        </div>
                    </div>
                    <div class="bottom martop">
                        <a href="javascript:history.back(-1)">
                            <div class="bottompin">返回</div>
                        </a>
                        <div class="bottompin">下一步</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="js/api.js"></script>
    <script src="jquery/jquery-3.6.0.js"></script>
    <script src="vue/vue.min.js"></script>
    <script src="axios/axios.js"></script>

    <script>
        // 获取从url地址截取出来的id
        function getQueryString(name) { //传进想要获取的querystring的key
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return decodeURIComponent(r[2]);
            return null;
        };

        // 把JSON对象转化为js对象
        var addvilla = JSON.parse(getQueryString("addvilla"));
        // 获取对象里面的属性
        // console.log(addvilla.villa_place);

        // 点击侧边栏按钮
        $(".location").click(function () {
            // 房型
            var house_apartment = $("#op1 option:selected").val();
            // 游泳池
            var swimming_pool = $("#op2 option:selected").val();
            // 浴缸
            var bathtub = $("#op3 option:selected").val();

            addvilla.house_apartment = house_apartment;
            addvilla.swimming_pool = swimming_pool;
            addvilla.bathtub = bathtub;
            // addvilla.user_id =addvilla.user_id;

            if ($(this).text() == "位置") {
                window.location.href = "listings1.html?addvilla=" + JSON.stringify(addvilla);
            }

            if ($(this).text() == "基本") {
                window.location.href = "listings2.html?addvilla=" + JSON.stringify(addvilla);
            }

            if ($(this).text() == "设施") {
                window.location.href = "listings3.html?addvilla=" + JSON.stringify(addvilla);
            }

            if ($(this).text() == "照片") {
                window.location.href = "listings4.html?addvilla=" + JSON.stringify(addvilla);
            }

            if ($(this).text() == "描述") {
                window.location.href = "listings5.html?addvilla=" + JSON.stringify(addvilla);
            }

            if ($(this).text() == "定价") {
                window.location.href = "listings6.html?addvilla=" + JSON.stringify(addvilla);
            }
        })

        // 下一步按钮
        $(".bottompin").click(function () {
            // 房型
            var house_apartment = $("#op1 option:selected").val();
            // 游泳池
            var swimming_pool = $("#op2 option:selected").val();
            // 浴缸
            var bathtub = $("#op3 option:selected").val();

            addvilla.house_apartment = house_apartment;
            addvilla.swimming_pool = swimming_pool;
            addvilla.bathtub = bathtub;

            window.location.href = "listings3.html?addvilla=" + JSON.stringify(addvilla);
        })



    </script>

</body>

</html>